<template>
    <div>
        <el-dialog title="详情" :visible.sync="dialogVisible" width="70%" :before-close="handleClose">
            <el-form :model="ruleForm"  ref="Form" class="demo-ruleForm">
                
                <div class="text">
                    <div class="tt">日期</div>
                    <div class="tt1">{{ruleForm.date}}</div>
                </div>
                <div class="text">
                    <div class="tt">广告主ID</div>
                    <div class="tt1">{{ruleForm.advertiser_id}}</div>
                </div>
                <div class="text">
                    <div class="tt">日终结余(元)</div>
                    <div class="tt1">{{ruleForm.balance}}</div>
                </div>
                <div class="text">
                    <div class="tt">现金支出(元)</div>
                    <div class="tt1">{{ruleForm.cash_cost}}</div>
                </div>
                <div class="text">
                    <div class="tt">总支出(元)</div>
                    <div class="tt1">{{ruleForm.cost}}</div>
                </div>
                <div class="text">
                    <div class="tt">冻结(元)</div>
                    <div class="tt1">{{ruleForm.frozen}}</div>
                </div>
                <div class="text">
                    <div class="tt">总存入(元)</div>
                    <div class="tt1">{{ruleForm.income}}</div>
                </div>
                <div class="text">
                    <div class="tt">赠款支出(元)</div>
                    <div class="tt1">{{ruleForm.reward_cost}}</div>
                </div>
                <div class="text">
                    <div class="tt">共享返货支出(元)</div>
                    <div class="tt1">{{ruleForm.shared_wallet_cost}}</div>
                </div>
                <div class="text">
                    <div class="tt">账户消耗的子钱包的共享余额(元)</div>
                    <div class="tt1">{{ruleForm.company_wallet_cost}}</div>
                </div>
                <div class="text">
                    <div class="tt">总转入(元)</div>
                    <div class="tt1">{{ruleForm.transfer_in}}</div>
                </div>
                <div class="text">
                    <div class="tt">总转出(元)</div>
                    <div class="tt1">{{ruleForm.transfer_out}}</div>
                </div>
                
                
                <div style="height:20px;width: 100%;"></div>
            </el-form>
        </el-dialog>
    </div>
</template>
  
<script>
export default {
    name: 'detail',
    data() {
        return {
            dialogVisible: false,
            ruleForm:'',
        }
    },
    created() {
    },
    mounted() {

    },
    methods: {
        handleClose(){
            this.dialogVisible = false 
        },
        open(res) {
            this.ruleForm = JSON.parse(JSON.stringify(res))
            this.dialogVisible = true 
        },
    }
}
</script>
<style lang="scss" scoped>
    .text{
        width: 50%;
        padding: 0 20px;
        padding-right: 35px;
    }
    .text:nth-child(2n){
        padding-right:20px;
        padding-left: 35px;
    }
    .demo-ruleForm{
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .tt{
        font-size: 14px;
        line-height: 22px;
        font-weight: 400;
        margin-bottom: 15px;
        color: rgba(0,0,0,0.4);
    }
    .tt1{
        font-size: 14px;
        margin-bottom: 20px;
        color: rgba(0,0,0,0.9);
    }
    .el-select{
        width: 100%;
    }
    .el-date-editor{
        width: 100%;
    }
    .heng{
       position: absolute;
       bottom: 80px;
       width: 100%;
        margin-left: -20px;
        height: 1px;
        background-color: #eee;
    }
    .foot{
        width: 100%;
        margin-top: 20px;
        text-align: right;
    }
</style>
  